<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-tiles"
	prefix="tiles"%>

<rich:panel header="#{messages['booking.label']}">
	<h:panelGrid>
		<h:outputText value="#{errorBean.errorMessage}" styleClass="error"></h:outputText>
	</h:panelGrid>
	
	<h:panelGrid width="100%" rendered="#{!(agentMemberBookingBean.lookupMemberForm || agentMemberBookingBean.lookupAgreementForm || agentMemberBookingBean.lookupPackageForm)}">
		<h:panelGroup>
		    <h:outputText value="#{messages['member.booking.label']}" styleClass="sub_header" />
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputText value="#{messages['instruction']}" styleClass="standardText_Instruction" />
		</h:panelGroup>
	</h:panelGrid>
	
	<t:panelGrid rendered="#{!(agentMemberBookingBean.lookupMemberForm || agentMemberBookingBean.lookupAgreementForm || agentMemberBookingBean.lookupPackageForm)}" columns="2" columnClasses="standardTable_ColumnLeft_20,standardTable_ColumnLeft_80" width="100%">
		<h:outputText></h:outputText>
		<t:message for="memberNo" styleClass="error"></t:message>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="memberNo" value="#{messages['membership.no.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		    <h:inputText size="20" maxlength="20" readonly="true" value="#{agentMemberBookingBean.member.membershipNo}" required="true"></h:inputText>
			<h:commandButton value="#{messages['search']}" styleClass="button" action="null" actionListener="#{agentMemberBookingBean.lookupMemberFormActionEvent}" immediate="true">
			</h:commandButton>
			<h:inputHidden required="true" id="memberNo" value="#{agentMemberBookingBean.member.membershipNo}"></h:inputHidden>
		</h:panelGroup>
		
		<h:outputText></h:outputText>
		<t:message for="agreementNo" styleClass="error"></t:message>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="agreementNo" value="#{messages['member.agreement.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		    <h:inputText size="20" maxlength="20" readonly="true" value="#{agentMemberBookingBean.agreement.agreetmentNo}" required="true"></h:inputText>
			<h:commandButton value="#{messages['search']}" styleClass="button" action="null" actionListener="#{agentMemberBookingBean.lookupAgreementFormActionEvent}" immediate="true">
			</h:commandButton>
			<h:inputHidden required="true" id="agreementNo" value="#{agentMemberBookingBean.agreement.agreetmentNo}"></h:inputHidden>
		</h:panelGroup>
		
		<h:outputText></h:outputText>
		<t:message for="bookingPackage" styleClass="error"></t:message>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="bookingPackage" value="#{messages['booking.package.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		    <h:inputText size="20" maxlength="20" readonly="true" value="#{agentMemberBookingBean.bookingPackage.packageCode}" required="true"></h:inputText>
			<h:commandButton value="#{messages['search']}" styleClass="button" action="null" actionListener="#{agentMemberBookingBean.lookupPackageFormActionEvent}" immediate="true">
			</h:commandButton>
			<h:inputHidden required="true" id="bookingPackage" value="#{agentMemberBookingBean.bookingPackage.packageCode}"></h:inputHidden>
		</h:panelGroup>
		
		<h:outputText></h:outputText>
		<t:message for="guestName" styleClass="error"></t:message>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="guestName" value="#{messages['guest.name.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<t:inputText id="guestName" required="true" size="50" maxlength="50" styleClass="standardText" value="#{agentMemberBookingBean.memberBooking.guestName}"></t:inputText>
		
		<h:outputText></h:outputText>
		<t:message for="noOfPax" styleClass="error"></t:message>
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="noOfPax" value="#{messages['no.of.pax.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<t:inputText id="noOfPax" required="true" size="3" maxlength="3" styleClass="standardText" value="#{agentMemberBookingBean.memberBooking.noOfPax}"></t:inputText>
		
		<h:outputText></h:outputText>
		<t:message for="checkIn" styleClass="error"></t:message>
		<h:panelGroup>
	    	<h:outputText value="*" styleClass="standardText_Mandatory" />	
		    <h:outputLabel for="checkIn" value="#{messages['booking.checkin.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		    	<t:inputCalendar
		    	id="checkIn"
					monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader" 
					currentDayCellClass="currentDayCell" value="#{agentMemberBookingBean.memberBooking.checkInDate}"
					renderAsPopup="true" popupTodayString="#{messages['popup.today']}"
					popupWeekString="#{messages['popup.week']}" popupDateFormat="dd/MM/yyyy"
					renderPopupButtonAsImage="true"
					styleClass="standardText" required="true" 
				>
				   <a4j:support ajaxSingle="true" event="onchange" action="null" reRender="checkOut" actionListener="#{agentMemberBookingBean.checkInCalendarActionEvent}" ></a4j:support>
		    	</t:inputCalendar>
		</h:panelGroup>
		
		<h:outputText></h:outputText>
		<t:message for="checkOut" styleClass="error"></t:message>
		<h:panelGroup>
	    	<h:outputText value="*" styleClass="standardText_Mandatory" />	
		    <h:outputLabel for="checkOut" value="#{messages['booking.checkout.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		        <t:outputText id="checkOut"  value="#{agentMemberBookingBean.memberBooking.checkOutDate}" styleClass="standardText">
		        	<f:convertDateTime pattern="dd/MM/yyyy" timeZone="Asia/Kuala_Lumpur"/>
		        </t:outputText>
		        <%-- 
		    	<t:inputCalendar
		    	id="checkOut"
					monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader" 
					currentDayCellClass="currentDayCell" value="#{adminMemberBookingBean.memberBooking.checkOutDate}"
					renderAsPopup="true" popupTodayString="#{messages['popup.today']}"
					popupWeekString="#{messages['popup.week']}" popupDateFormat="dd/MM/yyyy"
					renderPopupButtonAsImage="true"
					styleClass="standardText" required="true"
		    	>
		    	</t:inputCalendar>
		    	--%>
		</h:panelGroup>
		
		
		
		<h:outputLabel for="extraBed" value="#{messages['booking.extra.bed.label']}" styleClass="standardText_Label" />
		<t:inputText id="extraBed" required="false" size="3" maxlength="3" styleClass="standardText" value="#{agentMemberBookingBean.memberBooking.extraBed}"></t:inputText>
		<%-- 
		<h:outputLabel for="confirmationNo" value="#{messages['booking.confirmation.no.label']}" styleClass="standardText_Label" />
		<t:inputText id="confirmationNo" required="false" size="20" maxlength="20" styleClass="standardText" value="#{adminMemberBookingBean.memberBooking.confirmationNo}"></t:inputText>
		
		<h:outputLabel for="confirmationDate" value="#{messages['booking.confirmation.date.label']}" styleClass="standardText_Label" />
		<t:inputCalendar
		    	id="confirmationDate"
					monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader" 
					currentDayCellClass="currentDayCell" value="#{adminMemberBookingBean.memberBooking.confirmationDate}"
					renderAsPopup="true" popupTodayString="#{messages['popup.today']}"
					popupWeekString="#{messages['popup.week']}" popupDateFormat="dd/MM/yyyy"
					renderPopupButtonAsImage="true"
					styleClass="standardText" required="false"
		    	>
		    	</t:inputCalendar>
		--%>
		<h:outputLabel for="remark" value="#{messages['booking.remark.label']}" styleClass="standardText_Label" />
		<t:selectOneMenu id="remark" styleClass="standardText" value="#{agentMemberBookingBean.remark.remarkId}" required="false">
				<f:selectItem itemLabel="#{messages['please.select']}" itemValue="" />
				<f:selectItems value="#{agentMemberBookingBean.selectRemark}"/>
		</t:selectOneMenu>
			    	
		<h:outputLabel for="otherRemark" value="#{messages['booking.other.remark.label']}" styleClass="standardText_Label" />		
		<t:inputTextarea id="otherRemark" styleClass="standardText" cols="20" rows="5" value="#{agentMemberBookingBean.memberBooking.otherRemarks}"></t:inputTextarea>
		
		<rich:spacer height="10"></rich:spacer>
		
		<t:panelGroup>
		   <t:panelGrid columns="2">
		   		<h:commandButton value="#{messages['submit']}" styleClass="button" action="#{agentMemberBookingBean.addMemberBookingAction}" actionListener="#{agentMemberBookingBean.addMemberBookingActionEvent}"></h:commandButton>
			    <h:commandButton value="#{messages['back']}" styleClass="button" action="#{agentMemberBookingBean.initMemberBookingListAction}" immediate="true"></h:commandButton>
		   </t:panelGrid>
		</t:panelGroup>
	</t:panelGrid>
	
	<h:panelGrid width="100%" rendered="#{agentMemberBookingBean.lookupMemberForm}" columns="1">
		<h:outputText value="#{messages['member.lookup.label']}" styleClass="sub_header" />
		
		<rich:dataTable id="dataMember" var="member" value="#{agentMemberBookingBean.memberList}" rows="20" width="99%">
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['membership.no.column']}"></h:outputText>
					</f:facet>
				
					<h:commandLink action="#{agentMemberBookingBean.navAddMemberBookingAction}" actionListener="#{agentMemberBookingBean.lookupMemberSelectedActionEvent}">
						<h:outputText value="#{member.membershipNo}"></h:outputText>
					</h:commandLink>
					<f:param id="memberId" value="#{member.memberId}" />
				</rich:column>	
				
				<rich:column style="text-align:center;width:30%;">
					<f:facet name="header">
						<h:outputText value="#{messages['member.name.column']}"></h:outputText>
					</f:facet>
				
					<h:commandLink action="#{agentMemberBookingBean.navAddMemberBookingAction}" actionListener="#{agentMemberBookingBean.lookupMemberSelectedActionEvent}">
						<h:outputText value="#{member.name}"></h:outputText>
					</h:commandLink>
				</rich:column>
				
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['member.type.column']}"></h:outputText>
					</f:facet>
				
				    <h:outputText value="#{member.memberType}"></h:outputText>
				    
				</rich:column>
						
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['created.date.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="#{member.createdDate}">
						<f:convertDateTime pattern="dd/MM/yyyy" timeZone="Asia/Kuala_Lumpur"/>
					</h:outputText>
				</rich:column>
				
			</rich:dataTable>
					
			<rich:spacer height="10"></rich:spacer>
					
			<rich:datascroller align="left"  for="dataMember" maxPages="20" />
			
			<h:commandButton value="#{messages['back']}" styleClass="button" action="null" actionListener="#{agentMemberBookingBean.lookupFormCloseActionEvent}" immediate="true">
			</h:commandButton>
	</h:panelGrid>
	
	<h:panelGrid width="100%" rendered="#{agentMemberBookingBean.lookupAgreementForm}" columns="1">
		<h:outputText value="#{messages['agreement.lookup.label']}" styleClass="sub_header" />
		
		<rich:dataTable id="dataAgreement" var="agreement" value="#{agentMemberBookingBean.agreementList}" rows="20" width="99%">
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['agreement.no.column']}"></h:outputText>
					</f:facet>
				
					<h:commandLink action="#{agentMemberBookingBean.navAddMemberBookingAction}" actionListener="#{agentMemberBookingBean.lookupAgreementSelectedActionEvent}">
						<h:outputText value="#{agreement.agreetmentNo}"></h:outputText>
					</h:commandLink>
					<f:param id="agreementId" value="#{agreement.agreementId}" />
				</rich:column>	
				
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['agreement.date.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="#{agreement.agreetmentDate}">
						<f:convertDateTime pattern="dd/MM/yyyy" timeZone="Asia/Kuala_Lumpur"/>
					</h:outputText>
				</rich:column>
				
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['membership.type.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="#{agreement.membershipType}"></h:outputText>
				</rich:column>
		</rich:dataTable>
		
		<rich:spacer height="10"></rich:spacer>
					
		<rich:datascroller align="left"  for="dataAgreement" maxPages="20" />
			
		<h:commandButton value="#{messages['back']}" styleClass="button" action="null" actionListener="#{agentMemberBookingBean.lookupFormCloseActionEvent}" immediate="true">
		</h:commandButton>
	</h:panelGrid>
	
	<h:panelGrid width="100%" rendered="#{agentMemberBookingBean.lookupPackageForm}" columns="1">
		<h:outputText value="#{messages['booking.package.lookup.label']}" styleClass="sub_header" />
		
		<rich:dataTable id="dataPackage" var="package" value="#{agentMemberBookingBean.bookingPackageList}" rows="20" width="99%">
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['package.mgmt.code.column']}"></h:outputText>
					</f:facet>
				
					<h:commandLink action="#{agentMemberBookingBean.navAddMemberBookingAction}" actionListener="#{agentMemberBookingBean.lookupPackageSelectedActionEvent}">
						<h:outputText value="#{package.packageCode}"></h:outputText>
					</h:commandLink>
					<f:param id="packageId" value="#{package.packageId}" />
				</rich:column>	
				
				<rich:column style="text-align:center;width:30%;">
					<f:facet name="header">
						<h:outputText value="#{messages['package.mgmt.desc.column']}"></h:outputText>
					</f:facet>
				
					<h:commandLink action="#{agentMemberBookingBean.navAddMemberBookingAction}" actionListener="#{agentMemberBookingBean.lookupPackageSelectedActionEvent}">
						<h:outputText value="#{package.packageDesc}"></h:outputText>
					</h:commandLink>
				</rich:column>
		</rich:dataTable>
		
		<rich:spacer height="10"></rich:spacer>
					
		<rich:datascroller align="left"  for="dataPackage" maxPages="20" />
			
		<h:commandButton value="#{messages['back']}" styleClass="button" action="null" actionListener="#{agentMemberBookingBean.lookupFormCloseActionEvent}" immediate="true">
		</h:commandButton>
	</h:panelGrid>
</rich:panel>
